<template>
<block>

<view class="margin-bottom-bar">
  <view class="cu-list menu-avatar">
    <navigator class="cu-item" url="/pages/user/user-address/list/index?select=true" v-if="orderSubParm.deliveryWay == '1'">
      <view class="cu-avatar round cuIcon-location bg-black"></view>
      <view class="content loc-content" v-if="userAddress">
        <view class="flex padding-top-sm">
          <view class="cu-tag bg-red radius margin-right-sm" v-if="userAddress.isDefault == '1'">默认</view>
          <view class="text-black">{{userAddress.userName}}</view>
          <view class="text-gray text-sm margin-left-sm">{{userAddress.telNum}}</view>
        </view>
        <view class="text-gray text-sm overflow-2 loc-info padding-bottom-sm address">
						{{userAddress.provinceName}}{{userAddress.cityName}}{{ituserAddressem.countyName}}{{userAddress.detailInfo}}
        </view>
      </view>
      <view class="content loc-content" v-if="(!userAddress)">
        请选择收货地址
      </view>
      <view class="action">
        <text class="cuIcon-right"></text>
      </view>
    </navigator>
  </view>
  <view class="cu-card article">
    <view class="cu-item">
      <view class="cu-list menu">
        <view v-for="(item,index) in (orderConfirmData)" :key="index">
            


<view class="flex align-center">
              <image :src="item.picUrl ? item.picUrl : '/public/img/no_pic.png'" mode="aspectFill" class="row-img margin-top-xs"></image>
             </view>


 
              


<view class="row-info margin-left">
                <view class="text-black margin-top-xl overflow-2">{{item.spuName}}</view>
                <view class="text-gray text-sm margin-top-xs cu-tag round" v-if="item.specInfo">{{item.specInfo}}</view>
                <view class="flex margin-top-sm">
                  <view class="flex-sub">
                    <text class="text-price text-xl text-blue text-bold margin-top-sm">{{item.salesPrice}}</text>
                  </view>
                  <view class="flex-twice text-gray text-sm text-right margin-right">
                    x{{item.quantity}}
                  </view>
                </view>
              </view>



        </view>
        <view class="cu-item margin-top-sm">
          <text class="text-gray text-sm">订单金额</text>
          <view class="action">
            <view class="text-price">{{salesPrice}}</view>
          </view>
        </view>
        <view class="cu-item margin-top-sm">
          <text class="text-gray text-sm">运费金额</text>
          <view class="action">
            <view class="text-price">{{freightPrice}}</view>
          </view>
        </view>
        
      </view>
    </view>
  </view>
  <view class="cu-card mar-top-30">
    <view class="cu-item cu-form-group align-start" style="height:200rpx;">
      <input style="font-size:24rpx; margin-top:20rpx;" @input="userMessageInput" placeholder="给卖家留言"/>
    </view>
	</view>
</view>
<view class="cu-bar tabbar bg-white border foot">
  <view class="flex response">
    <view class="flex-sub"></view>
    <view class="flex-treble bar-rt">
      <text class="text-sm text-gray">共{{orderConfirmData.length}}件，</text>
      <text class="text-sm text-gray">合计：</text>
      <text class="text-xl text-price text-blue text-bold">{{numberUtil.numberAddition(paymentPrice,freightPrice)}}</text>
      <button class="cu-btn shadow-blur margin-left-sm" style="background-color: #2967ff;font-weight:300;width:220rpx;" @tap="orderSub" :loading="loading" :disabled="loading" type="">
        <text class="text-white">提交订单</text>
      </button>
    </view>
  </view>
</view>
<user-auth/>
</block>
</template>
<script module="numberUtil" lang="wxs" src="../../../utils/numberUtil.wxs"></script>
<script>
import userAuth from "@/components/user-auth/index";
import couponUserInfo from "@/components/coupon-user-info/index";
const app = getApp();
export default {
                    components: {
                      userAuth,
                      couponUserInfo
                    },
                    data() {
            return {
              orderConfirmData: [],
              salesPrice: 0,
              paymentPrice: 0,
              freightPrice: 0,
              userAddress: null,

              orderSubParm: {
                paymentType: '1',
                deliveryWay: '1'
              },

              loading: false,
              userInfo: null,
              spuIds: [],
              freightMap: "",

              ituserAddressem: {
                countyName: ""
              }
            };
        }, 
onShow() {}, 
onLoad: function () {
  this.userAddressPage();
  this.userInfoGet();
  this.orderConfirmDo();
}, 
methods: {
    deliveryWayChange(e) {
      this.orderSubParm.deliveryWay=e.detail.value
      this.setData({
        freightMap: null
      });
      this.orderConfirmDo();
    },

    orderConfirmDo() {
      // 本地获取参数信息
      let that = this;
      uni.getStorage({
        key: 'param-orderConfirm',
        success: function (res) {
          let orderConfirmData = res.data;
          let salesPrice = 0; //订单金额

          let freightPrice = 0; //运费

          let spuIds = null;
          orderConfirmData.forEach((orderConfirm, index) => {
            if (spuIds) {
              spuIds = spuIds + ',' + orderConfirm.spuId;
            } else {
              spuIds = orderConfirm.spuId;
            }

            salesPrice = (Number(salesPrice) + orderConfirm.salesPrice * orderConfirm.quantity).toFixed(2);
            orderConfirm.paymentPrice = (orderConfirm.salesPrice * orderConfirm.quantity).toFixed(2); //计算运费

            orderConfirm.freightPrice = 0;
            freightPrice = (Number(freightPrice) + Number(orderConfirm.freightPrice)).toFixed(2);
          });
          that.setData({
            orderConfirmData: orderConfirmData,
            salesPrice: salesPrice,
            freightPrice: freightPrice,
            paymentPrice: salesPrice,
            spuIds: spuIds
          });
        }
      });
    },

    //计算运费
    countFreight(orderConfirm, freightTemplat, quantity) {},

    //获取默认收货地址
    userAddressPage() {
      app.globalData.api.userAddressPage({
        searchCount: false,
        current: 1,
        size: 1,
        isDefault: '1'
      }).then(res => {
        let records = res.data.records;

        if (records && records.length > 0) {
          this.setData({
            userAddress: records[0]
          });
        }
      });
    },

    //获取商城用户信息
    userInfoGet() {
      app.globalData.api.wxUserGet().then(res => {
        this.setData({
          userInfo: res.data
        });
      });
    },

    userMessageInput(e) {
      this.orderSubParm.userMessage=e.detail.value
    },

    //提交订单
    orderSub() {
      let that = this;
      let userAddress = that.data.userAddress;

      if (that.data.orderSubParm.deliveryWay == '1' && userAddress == null) {
        uni.showToast({
          title: '请选择收货地址',
          icon: 'none',
          duration: 2000
        });
        return;
      }

      that.setData({
        loading: true
      });
      let orderSubParm = that.data.orderSubParm;
      orderSubParm.skus = that.data.orderConfirmData;
      app.globalData.api.orderSub(Object.assign({}, {
        userAddressId: that.data.orderSubParm.deliveryWay == '1' ? userAddress.id : null
      }, orderSubParm)).then(res => {
        uni.redirectTo({
          url: '/pages/order/order-detail/index?callPay=true&id=' + res.data.id
        });
      }).catch(() => {
        that.setData({
          loading: false
        });
      });
    }
}
                };
</script>
<style >
.bar-rt{
  text-align: right!important;
  margin-right: 10rpx!important
}
.row-img{
  width: 600rpx!important;
  height: 600rpx!important;
  margin:0 auto;
  border-radius: 10rpx;
}
.row-info{
  display: block!important;
}
.loc-content{
  width: calc(100% - 96rpx - 60rpx - 80rpx)!important;
  left: 126rpx!important
}
.loc-info{
  line-height: 1.4em
}
.list-item {
  display: block !important;
  padding: 6rpx !important;
}
.cu-list.menu>.cu-item:after {
  border-bottom: unset !important
}
.cu-list.menu>.cu-item {
  min-height: unset !important
}
.delivery-way{
  justify-content: unset !important
}
.address{
  line-height:160%;
  font-weight:300;
}
</style>